<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%@
	page contentType="text/html;charset=utf-8"%><%
/*	
	更新记录：
		2013-01-25 取消对SmartUpload的使用，改用commons-fileupload组件。因为测试发现SmartUpload有内存泄露的问题。
*/
//String path = request.getContextPath();
//String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
String cok = request.getHeader("Cookie");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
  <head>
    <title>泽优小文件上传控件(up2)-vue示例</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <link href="js/up2.css" type="text/css" rel="Stylesheet"/>
    <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="js/json2.min.js"></script>
    <script type="text/javascript" src="js/up2.app.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/up2.edge.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/up2.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/up2.file.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/vue.min.js" charset="utf-8"></script>
  </head>
  
  <body>
  	<p>此页面演示多文件上传，自定义文件路径功能。</p>
  	<p><a href="single.html" target="_blank">单文件上传演示</a></p>
  	<p><a href="index.jsp">普通示例</a></p>
    <p><a href="vue.jsp">vue示例</a></p>
  	<p>输入本地文件路径可上传指定路径的文件。</p>
    <div id="vue-up2">
	    <p>
	        文件路径：<input id="filePath" type="text" size="50" value="D:\\360safe-inst.exe" />&nbsp;
	        <input id="btnUpF" type="button" value="上传本地文件" />
	    </p>
	    <up2 ref="up2"></up2>
	    <input id="btnPost" type="button" value="开始上传队列" />
	</div>
    <div id="msg"></div>
	<script type="text/javascript" language="javascript">
      //定义组件
        Vue.component('up2', {
            data() {return {app: null}},
            props: {},
            mounted() {
                this.app = new HttpUploaderMgr();
                this.app.Config["Droper"] = false;
                this.app.Config["PostUrl"] = "http://localhost:8080/up2/upload.jsp";
                this.app.event.post_complete = function (url) { $("#msg").append(url + "<br/>"); };
                this.app.event.add_file = function (f/*HttpUploader*/) { $("#msg").append(f.fileLoc.path + "<br/>"); };
                this.app.event.queue_complete = function () { };//队列上传完毕
                this.app.loadTo("up2-tmp");
            },
            methods: {},
            destroyed(){},
            template: '<div id="up2-tmp"></div>'
        });
 
        //创建vue对象
        var ue = new Vue({
            el: '#vue-up2',
            data: {}
            , methods: {}
            , mounted: function () {
                var up2 = this.$refs.up2.app;
                $(this.$refs.btnPost).click(function () { up2.postAll(); });
                $(this.$refs.btnUpF).click(function () { up2.addFile($(this.$refs.filePath).val()); });
            }
        });
	</script>
  </body>
</html>